<h1><?php echo $this->titlePage; ?></h1>
<form action="" method=get">
    <div class="formfield">
        <label for="">Nome:</label>
        <input id="nomeCli" name="nomeCli" type="text">
    </div>
    <div class="formfield">
        <label for="">CPF:</label>
        <input id="cpfCli" name="cpfCli" type="text">
    </div>
    <div class="formfield">
        <label for="">RG:</label>
        <input id="rgCli" name="rgCli" type="text">
    </div>
    
    <div class="formbutton">
        <button id="btBuscarCliente" type="button">Buscar</button>
        <button id="btNovoCliente" type="button" value="/cliente/formulario">Novo</button> 
    </div>
</form>

<br />

<!-- grid para exibir os dados -->
<div id="divResCliente">

</div>

<br />

<br />

<script>

    var clienteAutoComplete = <?php echo Zend_Json::encode($this->dadosAutoComplete); ?>

    $(function(){
       //Melhora aparência dos botões
       $( "input[type=submit], button" ).button();
       $("#cpfCli").mask("999.999.999-99");
       
        $('#btNovoCliente').click(function(){
            var url = $(this).attr('value');
            $('#ui-tabs-2').load(url);
            return false;
        });
    
    
        $( "#nomeCli" ).autocomplete({
            source: clienteAutoComplete
        });
    
        $('#divResCliente').load('/cliente/grid/nome/' + $('#nomeCli').val() + '/cpf/' + $('#cpfCli').val() + '/rg/' + $('#rgCli').val());
        $('#btBuscarCliente').click(function(){
        
            $('#divResCliente').load('/cliente/grid/nome/' + $('#nomeCli').val() + '/cpf/' + $('#cpfCli').val() + '/rg/' + $('#rgCli').val());
        });
    }); 
    
</script>